@import '@/styles/common/variables.scss';
#about{
  padding-bottom: 40px;
  >div{
    max-width: 75vw;
    margin: 0 auto;
    margin-top: 56px;
    padding-top: 32px;
  }
  .about_category{
    background-color: #ffffff;
    width: 192px;
    position: fixed;
    top: 88px;
    >p{
      height: 56px;
      line-height: 56px;
      color: #363434;
      font-size: 14px;
      padding-left: 16px;
      cursor: pointer;
      &.active,
      &:hover{
        font-weight: bold;
      }
    }
  }
  .about_content{
    margin-left: 232px;
    >div{
      >p{
        color: #363434;
        font-weight: bold;
        font-size: 16px;
        margin-bottom: 16px;
      }
    }

  }
  .about_item_content{
    background: #ffffff;
    padding: 24px 40px;
    .content_title{
      color: #363434;
      font-size: 24px;
      font-weight: 700;
    }
    .content_item{
      margin-bottom: 24px;
      color: #666666;
      font-size: 16px;
      line-height: 32px;
      letter-spacing: 0.4px;
    }
  }

  .el-menu.about_menu{
    display: none;
  }
}

#rampow  #app  #about .el-menu.about_menu{
  position: fixed;
  top: $menuHeight !important;
  width: 100%;
  padding-left: 20px;
  background-color: transparent;
  background-color: #ffffff;
  .el-submenu ,.el-submenu__title {
    background-color: transparent;
    height: 44px;
    line-height: 44px;
  }
  .el-submenu__icon-arrow{
    font-size: 16px;
    color: #363434;
    .privacyPolicy{
      .about_item_content .content_item{
        margin-top: 0;
        margin-bottom: 24px;
      }
    }
  }
}

#rampow .el-menu--horizontal.about_center{
  left: 0 !important;
  width: 100%;
  top: 95px !important;
  z-index: 20 !important;
  ul{
    padding: 0 20px;
    .el-menu-item{
      height: 56px;
      line-height: 56px;
      color: #363434;
      font-size: 14px;
      &:hover{ background-color: transparent;}
      &.is-active{
        font-weight: 700;
      }

    }
  }

}

#about{
  @include respond('768'){
    >div{
      max-width: none;
      padding-top: 0;
    }
    .about_category{
      display: none;

    }
    .about_content{
      margin-left: 0;
      margin: $menuHeight+44px 20px 0;
      padding-top: 16px;
      .title{margin-bottom: 8px;}
      .about_item_content{
        min-height: auto !important;
        padding: 16px ;
      .content_title{font-size: 20px;}
      .content_item{
        margin-bottom: 12px;
        font-size: 14px;
        line-height: 24px;
      }
      .el-button{margin-top: 12px;margin-bottom: 32px;}
      
      }
    }
    .about_contact_content.about_item_content{
      .el-button{width: 100%;}
    }
    .el-menu.about_menu{display: block;z-index: 20;}
  }
}
